<template>
  <div>
    <div class="header">
      <h3><i class="el-icon-office-building"></i> 地产分类</h3>
    </div>
    <el-card class="box-card" v-for="item in CategoryLsit" :key="item.id">
      <el-row type="flex">
        <div class="imageSize">
          <img :src="item.image" alt="" />
        </div>
        <div class="demo">
          <h1 class="title">{{ item.title }}</h1>
         <div class="desc"> <p><b>类别简介:</b> {{ item.desc }}</p></div>
          <div class="date">
            <p>
            <b>最近更新时间:</b>
            {{ new Date(item.updated_at).toLocaleString() }}
          </p>
          </div>

          <el-row type="flex" justify="end">
            <el-button
              type="primary"
              icon="el-icon-share"
              plain
              round
              @click="$router.push(`/detail/${item.id}`)"
              >点击查询附近类型房产</el-button
            >
          </el-row>
        </div>
      </el-row>
    </el-card>
  </div>
</template>

<script>
require("@/assets/css/demo.css");
import { GetCategory} from "@/api";
export default {
  async mounted() {
    let { data } = await GetCategory();
    this.CategoryLsit = data;

  },
  data() {
    return {
      CategoryLsit: [],
    };
  },
  methods: {
    Categorydetails(id) {
      console.log(id);
    },
  },
};
</script>

<style>

</style>
